<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta
      name="viewport"
      content="width=device-width,initial-scale=1,user-scalable=no"
    />
    <meta
      name="description"
      content="Apache ECharts，一款基于JavaScript的数据可视化图表库，提供直观，生动，可交互，可个性化定制的数据可视化图表。"
    />
    <meta
      name="keywords"
      content="echarts,apache,charts,data-visualization,charting-library,visualization,data-viz,canvas,svg,plot,graph"
    />
    <link rel="shortcut icon" href="./images/favicon.png?_v_=20200710_1" />
    <link rel="stylesheet" type="text/css" href="./global/bootstrap.min.css" />
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries-->
    <!--[if lt IE 9
      ]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script
    ><![endif]-->
    <link
      rel="stylesheet"
      type="text/css"
      href="./css/main.css?_v_=a95711177c"
    />
    <script>
      window.EC_WWW_LANG = "zh";
    </script>
    <script type="text/javascript" src="./global/pace.min.js"></script>
    <script id="font-hack" type="text/javascript">
      if (/windows/i.test(navigator.userAgent)) {
        var el = document.createElement("style");
        el.innerHTML =
          "" +
          '@font-face {font-family:"noto-thin";src:local("Microsoft Yahei");}' +
          '@font-face {font-family:"noto-light";src:local("Microsoft Yahei");}';
        document.head.insertBefore(el, document.getElementById("font-hack"));
      }
    </script>
    <title>Documentation - Apache ECharts</title>
    <style>
      html,
      body {
        /* position: sticky should not have overflow parents.*/
        overflow-x: hidden;
      }
    </style>
    <link rel="stylesheet" href="./global/element-ui@2.13.2-index.css" />
    <link rel="stylesheet" href="./css/doc-bundle.css?_v_=a9cf686491" />
    <script type="text/javascript" src="./global/jquery.min.js"></script></head
  ><!--[if lte IE 8
    ]><body class="lower-ie">
      <div id="lowie-main">
        <img src="./images/forie.png?_v_=20200710_1" alt="ie tip" />
      </div></body
  ><![endif]-->
  <!--[if (gt IE 8)|!(IE)]><body class="undefined"></body><!
  [endif]--><noscript
    ><div class="no-script">
      <strong
        >很抱歉，Apache ECharts 网站需要启用 JavaScript 才能正常运行。</strong
      >
    </div></noscript
  >
  <div id="apache-banner">
    <div class="txt">
      <p>请访问 Apache ECharts 的官网 &nbsp;</p>
      <a id="a1" href="./index.html">https://echarts.apache.org</a>
    </div>
    <a
      href="https://echarts.apache.org"
      target="_blank"
      onclick="logApache()"
      class="btn btn-main"
      ><div>访问官网</div></a
    ><a href="javascript:;" onclick="closeApacheBanner(true)" class="close-btn"
      >x</a
    >
  </div>
  <div id="main">
    <nav id="ec-doc-nav" class="navbar navbar-default navbar-fixed-top doc-nav">
      <div class="container-fluid">
        <div class="navbar-header">
          <button
            type="button"
            data-toggle="collapse"
            data-target="#navbar-collapse"
            aria-expanded="false"
            class="navbar-toggle collapsed"
          >
            <span class="sr-only">Toggle navigation</span
            ><span class="icon-bar"></span><span class="icon-bar"></span
            ><span class="icon-bar"></span></button
          ><a href="./index.html" class="navbar-brand"
            ><img
              src="./images/logo.png?_v_=20200710_1"
              alt="echarts logo"
              class="navbar-logo"
          /></a>
        </div>
        <div id="navbar-collapse" class="collapse navbar-collapse">
          <ul class="nav navbar-nav navbar-left">
            <li id="nav-index">
              <a href="./index.html">首页</a>
            </li>
            <li id="nav-doc" class="dropdown">
              <a href="#" data-toggle="dropdown" class="dropdown-toggle"
                >文档<b class="caret"></b
              ></a>
              <ul class="dropdown-menu">
                <li>
                  <a href="./feature.html">特性</a>
                </li>
                <li>
                  <a href="https://echarts.apache.org/handbook/zh/get-started/"
                    >使用手册</a
                  >
                </li>
                <li>
                  <a href="./api.html">API</a>
                </li>
                <li>
                  <a href="./option.html">配置项手册</a>
                </li>
                <li>
                  <a href="./changelog.html">版本记录</a>
                </li>
                <li>
                  <a href="./faq.html">常见问题</a>
                </li>
                <li>
                  <a
                    href="https://echarts.apache.org/handbook/zh/basics/release-note/v5-upgrade-guide"
                    >v5 升级指南</a
                  >
                </li>
              </ul>
            </li>
            <li id="nav-download" class="dropdown">
              <a href="#" data-toggle="dropdown" class="dropdown-toggle"
                >下载<b class="caret"></b
              ></a>
              <ul class="dropdown-menu">
                <li>
                  <a href="./download.html">下载</a>
                </li>
                <li>
                  <a href="./download-theme.html">主题下载</a>
                </li>
                <li>
                  <a href="./download-extension.html">扩展下载</a>
                </li>
              </ul>
            </li>
            <li id="nav-examples">
              <a href="https://echarts.apache.org/examples/zh/index.html"
                >示例</a
              >
            </li>
            <li id="nav-resources">
              <a href="#" data-toggle="dropdown" class="dropdown-toggle"
                >资源<b class="caret"></b
              ></a>
              <ul class="dropdown-menu">
                <li>
                  <a href="./spreadsheet.html">表格工具</a>
                </li>
                <li>
                  <a href="./theme-builder.html">主题构建工具</a>
                </li>
                <li>
                  <a href="./cheat-sheet.html">术语速查手册</a>
                </li>
                <li>
                  <a href="./resources.html">更多资源</a>
                </li>
              </ul>
            </li>
            <li id="nav-contribute">
              <a href="#" data-toggle="dropdown" class="dropdown-toggle"
                >社区<b class="caret"></b
              ></a>
              <ul class="dropdown-menu">
                <li>
                  <a href="./events.html">活动</a>
                </li>
                <li>
                  <a href="./committers.html">贡献者列表</a>
                </li>
                <li>
                  <a href="./maillist.html">邮件列表</a>
                </li>
                <li>
                  <a href="./contributing.html">如何贡献</a>
                </li>
                <li>
                  <a href="./dependencies.html">依赖项</a>
                </li>
                <li>
                  <a href="./coding-standard.html">代码规范</a>
                </li>
                <li>
                  <a href="https://github.com/apache/echarts" target="_blank"
                    >源码（GitHub）<svg
                      width="15px"
                      height="15px"
                      viewbox="0 0 100 100"
                      version="1.1"
                      xmlns="http://www.w3.org/2000/svg"
                      xmlns:xlink="http://www.w3.org/1999/xlink"
                      class="icon-external-link"
                    >
                      <path
                        fill="currentColor"
                        d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"
                      ></path>
                      <polygon
                        fill="currentColor"
                        points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"
                      ></polygon></svg
                  ></a>
                </li>
                <li>
                  <a
                    href="https://github.com/apache/echarts/issues"
                    target="_blank"
                    >Issues（GitHub）<svg
                      width="15px"
                      height="15px"
                      viewbox="0 0 100 100"
                      version="1.1"
                      xmlns="http://www.w3.org/2000/svg"
                      xmlns:xlink="http://www.w3.org/1999/xlink"
                      class="icon-external-link"
                    >
                      <path
                        fill="currentColor"
                        d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"
                      ></path>
                      <polygon
                        fill="currentColor"
                        points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"
                      ></polygon></svg
                  ></a>
                </li>
              </ul>
            </li>
            <li id="nav-others">
              <a href="#" data-toggle="dropdown" class="dropdown-toggle"
                >ASF<b class="caret"></b
              ></a>
              <ul class="dropdown-menu">
                <li>
                  <a href="https://www.apache.org/" target="_blank"
                    >Apache Software Foundation<svg
                      width="15px"
                      height="15px"
                      viewbox="0 0 100 100"
                      version="1.1"
                      xmlns="http://www.w3.org/2000/svg"
                      xmlns:xlink="http://www.w3.org/1999/xlink"
                      class="icon-external-link"
                    >
                      <path
                        fill="currentColor"
                        d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"
                      ></path>
                      <polygon
                        fill="currentColor"
                        points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"
                      ></polygon></svg
                  ></a>
                </li>
                <li>
                  <a href="./security.html">安全</a>
                </li>
                <li>
                  <a href="https://www.apache.org/licenses/" target="_blank"
                    >版权<svg
                      width="15px"
                      height="15px"
                      viewbox="0 0 100 100"
                      version="1.1"
                      xmlns="http://www.w3.org/2000/svg"
                      xmlns:xlink="http://www.w3.org/1999/xlink"
                      class="icon-external-link"
                    >
                      <path
                        fill="currentColor"
                        d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"
                      ></path>
                      <polygon
                        fill="currentColor"
                        points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"
                      ></polygon></svg
                  ></a>
                </li>
                <li>
                  <a
                    href="https://www.apache.org/events/current-event"
                    target="_blank"
                    >活动<svg
                      width="15px"
                      height="15px"
                      viewbox="0 0 100 100"
                      version="1.1"
                      xmlns="http://www.w3.org/2000/svg"
                      xmlns:xlink="http://www.w3.org/1999/xlink"
                      class="icon-external-link"
                    >
                      <path
                        fill="currentColor"
                        d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"
                      ></path>
                      <polygon
                        fill="currentColor"
                        points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"
                      ></polygon></svg
                  ></a>
                </li>
                <li>
                  <a
                    href="https://www.apache.org/foundation/sponsorship.html"
                    target="_blank"
                    >捐赠<svg
                      width="15px"
                      height="15px"
                      viewbox="0 0 100 100"
                      version="1.1"
                      xmlns="http://www.w3.org/2000/svg"
                      xmlns:xlink="http://www.w3.org/1999/xlink"
                      class="icon-external-link"
                    >
                      <path
                        fill="currentColor"
                        d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"
                      ></path>
                      <polygon
                        fill="currentColor"
                        points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"
                      ></polygon></svg
                  ></a>
                </li>
                <li>
                  <a
                    href="https://www.apache.org/foundation/thanks.html"
                    target="_blank"
                    >鸣谢<svg
                      width="15px"
                      height="15px"
                      viewbox="0 0 100 100"
                      version="1.1"
                      xmlns="http://www.w3.org/2000/svg"
                      xmlns:xlink="http://www.w3.org/1999/xlink"
                      class="icon-external-link"
                    >
                      <path
                        fill="currentColor"
                        d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"
                      ></path>
                      <polygon
                        fill="currentColor"
                        points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"
                      ></polygon></svg
                  ></a>
                </li>
              </ul>
            </li>
          </ul>
          <ul class="nav navbar-nav navbar-right">
            <li id="nav-homeen">
              <a href="javascript:;" onclick="changeLang('en')">EN</a>
            </li>
          </ul>
        </div>
      </div>
    </nav>
    <div class="page-main">
      <div id="ec-doc-main"></div>
      <div id="v4-link" class="alert alert-info alert-dismissible">
        <a href="https://echarts.apache.org/v4/zh/option.html">旧版本文档</a
        ><button
          type="button"
          data-dismiss="alert"
          aria-label="Close"
          class="close"
        >
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
    </div>
  </div>
  <script type="text/javascript" src="./global/bootstrap.min.js"></script>
  <script type="text/javascript" src="./js/common.js?_v_=85b684f192"></script>
  <script src="./global/vue.min.js"></script>
  <script src="./global/element-ui@2.13.2-index.js"></script>
  <script src="./global/codemirror.min.js"></script>
  <script src="./global/codemirror@5.56.0-javascript.js"></script>
  <script src="./global/beautifier.min.js"></script>
  <script src="./js/doc-bundle.js?_v_=c09495ac73"></script>
  <script type="text/javascript">
    document.getElementById("nav-doc").className = "active";
    window.EC_WWW_CDN_PAY_ROOT = "https://echarts.apache.org";
  </script>
  <script type="text/javascript">
    window.globalArgsExtra = {
      baseUrl: "documents/option-parts",
      docType: "option",
      locale: "zh",
    };
    if (window.EC_WWW_CDN_PAY_ROOT) {
      window.globalArgsExtra.cdnRoot =
        window.EC_WWW_CDN_PAY_ROOT + "/zh/" + window.globalArgsExtra.baseUrl;
    }
  </script>
  <script type="text/javascript">
    window.globalArgsExtra.version = "4aecba20ce";
    echartsDoc.init("#ec-doc-main", window.globalArgsExtra);
  </script>
  <!-- Baidu Tongji-->
  <script type="text/javascript">
    var _hmt = _hmt || [];
    (function () {
      var hm = document.createElement("script");

      hm.src = "https://hm.baidu.com/hm.js?54b918eee37cb8a7045f0fd0f0b24395";

      var s = document.getElementsByTagName("script")[0];
      s.parentNode.insertBefore(hm, s);
    })();
  </script>
  <!-- Google Analytics-->
  <script
    type="text/javascript"
    async
    src="https://www.googletagmanager.com/gtag/js?id=UA-141228404-1"
  ></script>
  <script type="text/javascript">
    window.dataLayer = window.dataLayer || [];
    function gtag() {
      dataLayer.push(arguments);
    }
    gtag("js", new Date());
    gtag("config", "UA-141228404-1");
  </script>
</html>
